﻿html {    font-size:          20px; }

body    {
    direction:          ltr;
    margin:             0px;
    color:              #fff;
    background-color: #161616;
    font-family: 'SimplerRegular', 'CeraGRMedium-Richkid';
     overflow: scroll;
     overflow-x:hidden;
}


table   { 
    padding:            0px; 
    margin:             0px;
}

td  { 
    vertical-align:     top; 
    padding:            0px;
}

p   { 
    direction:          rtl; 
    margin-top:         0px; 
    margin-bottom:      0px; 
}

a   {   }
a:hover, a:focus{color:inherit;}
img { max-width:100%; }
input[type="text"], input[type="password"]  { outline: none; }
input[type="password"] { font-family:Arial; }

textarea    { outline: none; }

h1, h2, h3, h4, h5, h6,button, .button {
    font-family: inherit;
}

.month {display: none;}
/*------------------------------------*\
   SiteGrid
\*------------------------------------*/

#SiteContainer          {position: absolute;width: 100%;height: 100%;right:0%;}
.sideMenuOpen #SiteContainer {/*transform: translate(-1%);transition-delay: 500ms*/;}

#SiteHeaderContainer    { color:#ffffff; padding:0px;position: absolute;width: 100%;}
#SiteGridContainer      { position:relative;}
#SiteGridContainer:after {content:  "";    position:  fixed;left: 0px;top: 0px;width:  100%;height:  100%;background: #000;opacity: 0;transition: all 200ms ease-in;-webkit-transition: all 200ms ease-in;pointer-events:none;z-index:11;}
.sideMenuOpen #SiteGridContainer:after {opacity:  0.6;}

#SiteFooterContainer    {  }

#SiteHeader             {max-width: 100%;margin-left: auto;margin-right: auto;margin-top:30px;padding: 0 30px;}
#SiteFooter             { }
#SiteGrid               { padding:0px; }

#GridRight              { float:right; width:250px; margin-left:40px; }
#GridPage               { }
#GridLeft               { float:right; display:none; }
#GridTop                {  }
#GridContent            {  }
#GridFooter             {  }

#PageLeft               { }
#PageRight              { }
#PageMenu               { }
#PageHeader             { }
#PageContent            { }
#PageKdm                { }
#PageFooter             { }
#PageBreadCrumps    {display:none;}


@media (max-width: 1170px)  { 
    #GridLeft           { display:none; } 
}

@media (max-width: 1170px) {
    /*#SiteHeaderContainer    { padding:0 5px; }*/
    /*#SiteGridContainer      { padding:0 5px; }*/
}

@media (max-width: 991px)  { 
    #GridPage               { float:none; width:100%; }
}

@media (max-width:767px) {
     #GridRight {float:none;width:100%; margin:0 auto;}
     body    { font-size:18px; }
}



/*------------------------------------*\
    Top Bar Select In Mobile 
\*------------------------------------*/

@media (max-width:767px) { #side-collapse-menu {width:100%} }

/*------------------------------------*\
    Top Bar Search 
\*------------------------------------*/

#search_form_header {margin-top: 10px;}
#search_form_header_input_continer { float: left; margin-left: 15px; }

@media(max-width:767px){
#search_form_header_input_continer       { text-align: center;display: inline-block;margin: 0 auto;width: 100%; }
#search_form_header_input                { display:inline-block; }
#search_form_header_submit               { width: 40px;display: inline-block; }
}



/*------------------------------------*\
    Accordion - FAQ
\*------------------------------------*/
.faq_accordion { padding-bottom: 30px; }

.accordion { }
.accordion .panel {border:0px; border-radius:0; border-top:1px solid #ECECEC;box-shadow:none; -webkit-box-shadow:none;padding:14.5px 0; margin:0;   }
.accordion .panel:nth-child(2n) {background-color:#EDEDED;}
.accordion .panel:last-child {border-bottom:1px solid #ddd;}
.accordion .panel-title {width:95%;}
.accordion .panel-title>a { width: 100%; right: 0; top: 0;  font-size:24px; font-family:'RaananSuperRegular'; }
.accordion .panel-title>a:hover { text-decoration:none; }
.accordion .panel-title>a:focus { text-decoration:none; }
.accordion .panel-collapse.collapse.in {   }
.accordion .panel-default>.panel-heading { color: #333; background-color: transparent; border-color: #ddd; position:relative; margin-bottom:10px; margin-top:10px; margin-right:15px; } 
.accordion .panel-heading { padding: 10px 15px; border-bottom: 0;border-radius: 0px; }
.accordion .panel-title>a:after { content: " "; display: block;width: 20px; height: 20px; float: left; background-image:url('../../../000Frames/site/images/plus.png');background-position: center center; background-repeat: no-repeat; }
.accordion .panel-title > a[aria-expanded~=true]:after {background: url('../../../000Frames/site/images/minus.png'); background-repeat: no-repeat; background-position: center center;  }
.panel.panel-default div p { font-size: 21px; padding-right: 50px; padding-left: 165px; line-height: 27px; /*padding-top: 20px; padding-bottom: 20px;*/ }

@media(max-width:767px){
    .panel.panel-default div p {padding-left:0;padding-right:30px;padding-top:5px;width:90%;}
    .accordion .panel-title>a:after {position:absolute;left: 7px; top: 50%; transform: translate(0,-50%); }
    .accordion .panel-default>.panel-heading {padding-right:0;}
    .accordion .panel-title>a {padding-right:0; font-size:20px;font-weight:bold;}
}


/*------------------------------------*\
    Carousel - FAQ
\*------------------------------------*/

.owl-carousel { margin-top: 30px;margin-bottom: 30px; direction:ltr;}
.owl-nav {  }
.owl-item {text-align:center; height:400px; overflow:hidden; }
.owl-item .item { position: absolute; top: 50%; left: 0; transform: translate(0%,-50%); -webkit-transform: translate(0%,-50%); -moz-transform: translate(0%,-50%); }
.owl-next { position: absolute; left: 0; z-index: 1; top: calc(50% - 12px); transform: translate(0%,-50%); -webkit-transform: translate(0%,-50%); -moz-transform: translate(0%,-50%); }
.owl-prev { position: absolute; right: 0; z-index: 1; top: calc(50% - 12px); transform: translate(0%,-50%); -webkit-transform: translate(0%,-50%); -moz-transform: translate(0%,-50%); }



@media(max-width:991px) { 
.owl-item .item { margin: 0 auto; text-align: center; max-width: 250px !important;
 position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); 
                }
}



/*------------------------------------*\
   lightbox Gallery
\*------------------------------------*/
.lightbox-gallery .lightbox-gallery-loader {position: absolute; top: 50%; /* display: none; */ left: 50%; z-index: 10;}
.lightbox-gallery .lightbox-gallery-item

/*------------------------------------*\
    lightbox Gallery Video
\*------------------------------------*/

.lightbox-galleryVideo .lightbox-gallery-loader {position: absolute; top: 50%; left: 50%; z-index: 10;}
.lightbox-galleryVideo .lightbox-gallery-item {}


.popUpVideo .modal-header {border:none;}

.popUpVideo .vertical-alignment-helper {
    display: table;
    height: 100%;
    width: 100%;
    pointer-events: none;
}

.popUpVideo .vertical-align-center {
    display: table-cell;
    vertical-align: middle;
    pointer-events: none;
}

.popUpVideo .modal-content {
    width: inherit;
    height: inherit;
    margin: 0 auto;
    pointer-events: all;
    background: none;
    box-shadow: 0px 0px 0px;
    border: none;
}


.popUpVideo .modal-body iframe {
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    width: 100%;
    height: 100%;
}

.popUpVideo .modal-backdrop.fade.in {
    z-index: 0;
}
.popUpVideo .close {opacity:1 !important; color:#fff; }

.popUpVideo .modal-backdrop.in { filter: alpha(opacity=50); opacity: .9; }

/*------------------------------------*\
   Breadcrumbps
\*------------------------------------*/

#PageBreadCrumps    { margin-bottom: 30px;display:none; }

@media(max-width:991px){#PageBreadCrumps{margin-bottom:10px;margin-top:10px;}}
    
#PageBreadCrumps a:link         { 
    background-image: url('../images/breadcrumbs-arrow.png');
    color: #5A5B5E;
    text-decoration: none !important;
    display: inline-block; 
    padding-right: 25px; 
    background-repeat: no-repeat; 
    background-position: right 10px top 7px; 
}

#PageBreadCrumps a:first-child  { background-image: none; padding-right: 0; }
#PageBreadCrumps a:visited      { color: #5A5B5E; text-decoration: none !important; font-size: 100%; }    
#PageBreadCrumps a:hover        { color: #5A5B5E; text-decoration: underline; font-size: 100%; }



/*------------------------------------*\
    Directory/Side Menu
\*------------------------------------*/

#rightMenu              {  }
#rightMenu .menuHead { padding-right: 10px; height: 27px; font-size: 18px; background: #ECECEC; color: #000; margin-top: 2px; background-image: url('../../../000Frames/site/images/right_menu_arrow.png'); background-size: 10px; background-repeat: no-repeat; background-position: 20px; }
#rightMenu .menuLink { padding-right: 10px; height: 27px; font-size: 18px; background: #ECECEC; color: #000; margin-top: 2px; background-image: url('../../../000Frames/site/images/right_menu_arrow.png'); background-size: 10px; background-repeat: no-repeat; background-position: 20px; }
#rightMenu .selected { color: red; }
#rightMenu .navbar-default {border:0; background-color:transparent;}
#rightMenu .navbar {min-height:0; margin-bottom:0;}
#rightMenu .navbar-header {float:right;}

@media(max-width:767px){ #rightMenu .navbar-header {float: none; width: 100%; margin: 0;} }
/*------------------------------------*\
    Contact Form
\*------------------------------------*/

.mrw-dynamic-form {
    position:relative;
}

.mrw-dynamic-form .form-messages,
.mrw-dynamic-form .form-messages .loading,
.mrw-dynamic-form .form-messages .success,
.mrw-dynamic-form .form-messages .error {
    display: none;
    color: #BA975D;
    z-index: 9999;
}

.mrw-dynamic-form .form-messages {
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    background-color: rgba(255,255,255,0.8);
}

.mrw-dynamic-form .error-message    { color:red; display:none; }
.mrw-dynamic-form .mrw-form-label   { font-weight:normal; }
.mrw-dynamic-form .form-group > div { margin-bottom:15px; }
.mrw-dynamic-form .form-control {
    border: 1px solid silver;
    color: #000;
    background: none;
    font-size:100%;
    padding-right: 10px;
    position: relative;
    cursor: text !important;
    background: none !important;
 }

.mrw-dynamic-form label.error      { color:red; position:absolute; top:0px; left:15px; font-weight:normal; }
.mrw-dynamic-form .form-control.error { border-color:red; }


/*------------------------------------*\
    Contact Form Wiget
\*------------------------------------*/


#contact-form-wiget .mrw-form-label         { }
#contact-form-wiget .form-control           { }
#contact-form-wiget .form-submit            { }

@media(max-width:991px) {
    #contact-form-wiget { display: none; }
}

/*------------------------------------*\
    Login Box
\*------------------------------------*/



#loginBox   { text-align:center; background-color:#1c1c1c; padding:15px; }

#loginBox .loginBox-guest-hello     { color:#F68B1F; line-height:24px; margin-bottom:10px; }
#loginBox .firstSentence      { font-size:130%; }
#loginBox .secondSentence     { font-size:165%; }

#loginBox #LoginBox-Buttons         { padding-top:20px; }
#loginBox #LoginBox-Buttons a       { display:inline-block; background-color:#F68B1F; border:1px solid #FFF; border-radius:5px; color:#FFF; font-size:120%; padding:2px 18px; margin:0px 5px; text-decoration:none; cursor:pointer; }

#loginBox #LoginBox-SignIn          {  width:100%; margin-left:auto; margin-right:auto;  overflow:auto; }
#loginBox #LoginBox-SignIn .login-field     { margin-bottom:12px; border-radius:3px; border: none; width:100%; padding:5px 10px 4px 10px; }
#loginBox #LoginBox-SignIn .login-submit    { float:left; background-color:#F68B1F; border:1px solid #FFF; border-radius:5px; color:#FFF; font-size:120%; padding:2px 18px; cursor:pointer; text-decoration:none; }

#loginBox #LoginBox-SignIn .forgetPass      { float:left; text-decoration:underline; color:#F68B1F; padding-top:10px; font-size:90%; }
#loginBox #LoginBox-SignIn .user-register      { float:right; text-decoration:underline; color:#F68B1F; padding-top:10px; font-size:90%; }

#loginBox .loginBox-user-hello      { color:#F68B1F; line-height:24px;  }
#loginBox .loginBox-user-buttons    { padding-top:20px; }
#loginBox .loginBox-user-buttons a  { display:inline-block; background-color:#F68B1F; border:1px solid #FFF; border-radius:5px; color:#FFF; font-size:110%; padding:2px 12px; margin:0px 2px; text-decoration:none; cursor:pointer; margin-bottom:10px; }





/*------------------------------------*\
   Bootstrap dropdown animation
\*------------------------------------*/

.dropdown .dropdown-menu {
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;

    max-height: 0;
    display: block;
    overflow: hidden;
    opacity: 0;
}

.dropdown.open .dropdown-menu {
    max-height: 200px;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
    opacity: 1;
}


/*------------------------------------*\
   BASE PAGE VIEW
\*------------------------------------*/


#anchor         { margin-bottom: 15px; margin-top: -5px; font-size: 90%; }
#headline       { margin-top: 5px;margin-bottom: 30px; }
#headline h1    { color: inherit;text-transform: uppercase;font-size: 500%; font-family: 'CeraGRBlack-Richkid'; margin-top: 0; line-height: 1;margin-bottom:10px;}
#headline .playList-title span.word {margin-right: 20px; display:inline-block;}
#subheadline h2 { margin: 0; padding: 0; font-size: 130%; color: #59595B; font-weight: normal; margin-bottom:10px;  }

#writer         { margin-bottom: 5px; font-weight: normal; }
#text1          { margin-top: 20px; margin-bottom:  20px; }
#text1 strong   { }
#text1 b        { }

#video          { margin-bottom:  20px; }
#video video    { width: 100%; height: auto; }

#remarks        { font-size: 90%; }

h3              { font-size: 100% !important; }
h4              {  }

.picD           { width: auto; height: auto; margin-bottom: 15px; margin-top: 15px; }

#lobby          { margin-bottom:30px; }


@media(max-width:1024px){
    #headline h1 {font-size: 370%;}
}

@media(max-width:991px){
    #headline h1 {font-size:470%}
}
/*------------------------------------*\
    #General Classes 
\*------------------------------------*/

.max-width { max-width: 1170px; }

.no-marg   { margin: 0px; }

.no-pad    { padding: 0px; }

.p-vert    { display: table; }

.c-vert    { display: table-cell; vertical-align: middle; }

.f-h       { height: 100%; }

.f-w       { width: 100%; }

.margin-auto { margin:0 auto }

@media (max-width: 767px)  { 
    /*.row            { margin:0px -5px; }*/
    /*.row > div      { padding:0px 5px; }*/
}



/*------------------------------------*\
    #modal
\*------------------------------------*/

.modal-vertical-align   { display: table; height: 100%; width: 100%; pointer-events: none; }
.vertical-align-center  { display: table-cell; vertical-align: middle; pointer-events: none; text-align:center; }

#mrw-modal-1    { }
#mrw-modal-1 .modal-content     { border-radius:0px; background-color:transparent; display:inline-block; pointer-events: all; }







/*------------------------------------*\
    #Grids
\*------------------------------------*/


.grid-view .grid-box { /*border-bottom: 1px solid #ddd;*/ margin-bottom: 30px; text-align: center;  }
.grid-view .grid-box-image      { padding-bottom:56%; position:relative; overflow:hidden; }
.grid-view .grid-box-image a    { display:block; position:absolute; left:0px; bottom:0px; right:0px; top:0px; }
.grid-view .grid-box-image img  { margin: 0 auto; max-width:100%; }



.grid-view.center-elements .row         { font-size:0px; text-align:center; }
.grid-view.center-elements .row > div   { display:inline-block; float:none !important; vertical-align:top; font-size:1rem; }






/*------------------------------------*\
    Fonts
\*------------------------------------*/



@font-face {
    font-family: 'CeraGRMedium-Richkid';
    src: url('../../../000Frames/site/fonts/CeraGRMedium-Richkid.eot');
    src: url('../../../000Frames/site/fonts/CeraGRMedium-Richkid.eot?#iefix') format('embedded-opentype'),
         url('../../../000Frames/site/fonts/CeraGRMedium-Richkid.woff') format('woff'),
         url('../../../000Frames/site/fonts/CeraGRMedium-Richkid.ttf') format('truetype'),
         url('../../../000Frames/site/fonts/CeraGRMedium-Richkid.svg#CeraGRMedium-Richkid') format('svg');
    font-weight: normal;
    font-style: normal;
    /*unicode-range: U+040-07F;   */    /* unicode for a-z and A-Z letters only! */
}

@font-face {
    font-family: 'CeraGRBlack-Richkid';
    src: url('../../../000Frames/site/fonts/CeraGRBlack-Richkid.eot');
    src: url('../../../000Frames/site/fonts/CeraGRBlack-Richkid.eot?#iefix') format('embedded-opentype'),
         url('../../../000Frames/site/fonts/CeraGRBlack-Richkid.woff') format('woff'),
         url('../../../000Frames/site/fonts/CeraGRBlack-Richkid.ttf') format('truetype'),
         url('../../../000Frames/site/fonts/CeraGRBlack-Richkid.svg#CeraGRBlack-Richkid') format('svg');
    font-weight: normal;
    font-style: normal;
    /*unicode-range: U+040-07F;*/       /* unicode for a-z and A-Z letters only! */
}

@font-face {
    font-family: 'SimplerRegular';
    src: url('../../../000Frames/site/fonts/SimplerRegular.eot');
    src: url('../../../000Frames/site/fonts/SimplerRegular.eot?#iefix') format('embedded-opentype'),
         url('../../../000Frames/site/fonts/SimplerRegular.woff') format('woff'),
         url('../../../000Frames/site/fonts/SimplerRegular.ttf') format('truetype'),
         url('../../../000Frames/site/fonts/SimplerRegular.svg#SimplerRegular') format('svg');
    font-weight: normal;
    font-style: normal;
    /*unicode-range: U+590-5ff,U+000-03F;*/ /* unicode range for hebrew letters, 0-9 and all special chars */
}

@font-face {
    font-family: 'SimplerBold';
    src: url('../../../000Frames/site/fonts/SimplerBold.eot');
    src: url('../../../000Frames/site/fonts/SimplerBold.eot?#iefix') format('embedded-opentype'),
         url('../../../000Frames/site/fonts/SimplerBold.woff') format('woff'),
         url('../../../000Frames/site/fonts/SimplerBold.ttf') format('truetype'),
         url('../../../000Frames/site/fonts/SimplerBold.svg#SimplerBold') format('svg');
    font-weight: normal;
    font-style: normal;
    /*unicode-range: U+590-5ff,U+000-03F;*/ /* unicode range for hebrew letters, 0-9 and all special chars */
}




/*------------------------------------*\
    PopUp Feature
\*------------------------------------*/

#popup-modal .vertical-alignment-helper {
    display: table;
    height: 100%;
    width: 100%;
}

#popup-modal .vertical-align-center {
    display: table-cell;
    vertical-align: middle;
    z-index:99999;
}
    
#popup-modal .modal-header {
    border: none;
    padding: 0px;
}

#popup-modal .close {
    display: block;
    float: none;
    margin: 0 auto;
    opacity: 1;transform: translateX(-50%);-webkit-transform:translateX(-50%);
    left: 50%;right:auto; 
}

#popup-modal .close span {
    color: #fff;
}

#popup-modal .modal-body {
    text-align: center;
}

#popup-modal .modal-content {
    border: 0px;
    background-color: transparent;
    border-radius: 0px;
    -webkit-box-shadow: none;width: auto;
    max-width: 90vw;
}


.vertical-alignment-helper { display: table; height: 100%;width: 100%; }
.vertical-align-center     { display: table-cell;vertical-align: middle; }




/*------------------------------------*\
    GALLERY COMPONENTS - lightBox
\*------------------------------------*/



.lightbox-gallery       { position:relative; min-height:250px; }
.lightbox-gallery-item  { display:none; text-align: center; padding-bottom: 7.5px; padding-top: 7.5px; }
.blueimp-gallery>.close, .blueimp-gallery>.title    { top:65px; display:block; }
.blueimp-gallery a.next         { display:block !important; }
.blueimp-gallery a.prev         { display:block !important; }
.blueimp-gallery ol.indicator   { display:block !important; }
.blueimp-gallery a.play-pause   { display:block !important; }





/*------------------------------------*\
    GALLERY COMPONENTS - #FLEX SLIDER 
\*------------------------------------*/


.flexslider {
    border: none;
    background: none;
    -webkit-box-shadow: 0 0px 0px rgba(0,0,0,0);
    -moz-box-shadow: 0 0px 0px rgba(0,0,0,0);
    -o-box-shadow: 0 0px 0px rgba(0,0,0,0);
    box-shadow: 0 0px 0px rgba(0,0,0,0);
    overflow:hidden;
}

.flexslider .flexslider-item {
    display: block;
    /*min-height: 200px;*/
    padding-bottom: 40%;
    background-size: cover;
    background-position: center center;
}

.flexslider .flex-control-nav { bottom:20px; z-index:2; }
.flex-control-paging li a.flex-active { background: #000; background: rgba(255,255,255,1); cursor: default; }
.flex-control-paging li a { background: #fff; background: rgba(255,255,255,0.7); }
.flexslider .flexslider-item {position:relative;}
.flexslider-item-content { position: absolute; right: 0; z-index: 9; top: 10%; right: 5%; padding: 15px; background: rgba(0,0,0,0.56); border-radius: 5px; }
.flexslider-item-title { text-align: right; color: #fff;font-size: 140%; }
.flexslider-item-description { text-align: right; color: #fff; }
.flexslider-item-readmore { text-align: right; color: #fff; font-size: 120%;}


@media(max-width:767px) {
.flexslider .flexslider-item { padding-bottom: 50%; min-height: 300px; }
}


/*------------------------------------*\
    Footer Style 
\*------------------------------------*/
#SiteFooterContainer {position:  absolute;bottom: 0;width: 100%;height: 65px;z-index:-1;}
#SiteFooterContainer .mixCloudLogo      { max-width: 133px;display:  inline-block;}
#SiteFooterContainer .richkidLogo       { max-width:  110px;display:  inline-block;}

/*------------------------------------*\
    UnderFooter Style 
\*------------------------------------*/

#UnderSiteFooter { padding: 20px; }

/*------------------------------------*\
    Bootstrap - 5 Cols Fix
\*------------------------------------*/

.col-xs-15,
.col-sm-15,
.col-md-15,
.col-lg-15 {
    position: relative;
    min-height: 1px;
    padding-right: 10px;
    padding-left: 10px;
}

.col-xs-15 {
    width: 20%;
    float: left;
}
@media (min-width: 768px) {

.col-sm-15 {
        width: 20%;
        float: left;
    }
}
@media (min-width: 992px) {
    .col-md-15 {
        width: 20%;
        float: left;
    }
}
@media (min-width: 1200px) {
    .col-lg-15 {
        width: 20%;
        float: left;
    }
}


/*------------------------------------*\
    BootBox - Js Modals
\*------------------------------------*/

.bootbox { text-align: center; }
.bootbox .modal-footer { text-align:center; }
.bootbox .modal-footer button { margin:10px; }
.bootbox .modal-footer .btn+.btn {margin-bottom:10px;}
.bootbox .modal-dialog { position: fixed; left: 50%; top: 50%; /* margin-left: -300px; */ transform: translate(-50%,-50%) !IMPORTANT; margin: 0; }

@media(max-width:767px){
    .bootbox .modal-dialog { width: 80%; }
}

::-webkit-scrollbar {width: 6px;height: 2px;}
::-webkit-scrollbar-button {width: 6px;height: 0px;}
::-webkit-scrollbar-thumb {background: #f15a55;border: 0px none #454545;border-radius: 0px;}
::-webkit-scrollbar-thumb:hover {background: #f15a55;}
::-webkit-scrollbar-thumb:active {background: #f15a55;}
::-webkit-scrollbar-track {background: #454545;border: 0px none #454545;border-radius: 0px;}
::-webkit-scrollbar-track:hover {background: #454545;}
::-webkit-scrollbar-track:active {background: #454545;}
::-webkit-scrollbar-corner {background: transparent;}


.hvr-sweep-to-right:before {background: #f15a55;transition-delay: 0.3s;}
.hvr-sweep-to-right:hover:before {transition-delay: 0s;}
.hvr-sweep-to-right:after {content: attr(data-text);position: absolute;width: 100%;height: 100%;top: 0;left: 0;opacity: 0;-webkit-transform: translate(-30%, 0);transform: translate(-30%, 0);-webkit-transition: all 0.6s;-moz-transition: all 0.6s;-o-transition: all 0.6s;transition: all 0.6s;margin-bottom: 0;font-size: 100%;padding: 0;text-align:  center;padding-top: 15px;transition-delay: 0s;pointer-events:  none;}
.hvr-sweep-to-right:hover:after {opacity: 1;-webkit-transform: translate(0, 0);transform: translate(0, 0);transition-delay: 0.1s;}
.hvr-sweep-to-right:hover > button {opacity: 0;transition-delay: 0s;}
.hvr-sweep-to-right > button {-webkit-transition: all 0.3s;-moz-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;transition-delay: 0.3s;padding: 0;margin-bottom: 0;background: transparent;margin-bottom: 0;font-size: 100%;padding: 15px 32px;}


.allMixtapes                        {position: absolute;bottom: 100px;left: 50%;transform: translateX(-50%);-webkit-transform:translateX(-50%);z-index:1;background: #474747;opacity:0;}
.allMixtapesContainer               {padding: 0px;background-color: #454545;width: 100%;position: fixed;top: 0;right: 0%;min-height: 100vh !important;/*transition: all 250ms ease-out; -webkit-transition: all 250ms ease-out;*/z-index: 2;opacity:1;background-image:url('../../../000Frames/site/images/mixTapesBG.jpg');display:none;/*transition: right 1000ms ease-in;-webkit-transition: right 1000ms ease-in;*/height:100%;}
.allMixtapesContainer.active        {/*width: 100%; opacity: 1;*/}
.mixTapeBoxWrapper                  { position: relative; padding-bottom: 100%; }
.mixTapeBoxWrapper img              { position: absolute;top: 0; left: 0; right: 0; bottom: 0; }
.mixTapeBoxWrapper svg              { width: 59px;height: 59px; position: absolute; bottom: 12px; right: 12px; }
.allMixtapesContainer .playList-title            { color: inherit; text-transform: uppercase; font-size: 360%; font-family: 'CeraGRBlack-Richkid';margin-top:0;line-height:1; padding-left:30px;}
.middlecontent .playList-title .word {margin-right: 40px;}
.middlecontent #closeIcon{width: 30px;height: auto;fill: #ffffff;}

.allMixtapesContainer .closePage    {position:  absolute;right: 30px;top: 15px; cursor:pointer;opacity:0;}
.allMixtapesContainer .Title {position:  relative;}
.middlecontent                      { display: table-cell;vertical-align: middle; position:relative; right:20px}
.allMixtapesContainerBtn            { text-align: center; display: block; margin-top: 50px; }
.allMixtapesContainerBtn button     { background: #474747; margin-bottom: 0; padding: 10px 22px; font-size: 120%; }
a.mixTapeBox                        { margin-bottom: 30px;opacity: 0;-webkit-transform: translateZ(-1em) rotateX(90deg);transform: translateZ(-1em) rotateX(90deg);-webkit-transform-origin: top center;-ms-transform-origin: top center;transform-origin: top center;-webkit-transition: all 2s cubic-bezier(0.19, 1, 0.22, 1);transition: all 2s cubic-bezier(0.19, 1, 0.22, 1);display: inline-block;}
a.mixTapeBox.showItem {opacity: 1;-webkit-transform: translateZ(0) rotateX(0);transform: translateZ(0) rotateX(0);-webkit-transition-delay: 0.525s;transition-delay: 0.525s;}
.mixTapeBoxes.row                   {height: 50vh;overflow: hidden;overflow-x: hidden;}

.colorLayer                         {position: fixed;top: 0;bottom: 0;left: -200%;width: 200%;height: 100vh;background: #F15A55;z-index: 11;}
/*.colorLayer.active                  {left: 100%;transition: all 1000ms ease-in;-webkit-transition: all 1000ms ease-in;}*/

.topImg             { position: relative; }
.topImg img { width: 100%; }
.playlistPage #siteheader-navigation-container .navbar-brand svg path { fill: #ffffff; }

.topImgCaption { position: absolute;top: 50%; left: 50%; transform:  translate(-50%,-50%);-webkit-transform: translate(-50%,-50%); text-align: center;opacity:0;transition: all 400ms ease-in; -webkit-transition: all 400ms ease-in; }
.topImgCaption.active  { opacity:1; }
.playlistDate  { font-family: 'CeraGRMedium-Richkid';font-size: 170%; }
.playIcon svg.playIcon,.playIcon svg.pauseIcon { width: 103px; } 
a.pause { display:none }

.playlistPage .playList-Wrapper { padding-top: 100px;padding-bottom:100px; }
.footerInternal                 { text-align: center;color: #444444; margin-bottom: 0px;font-size: 90%; margin-top: 30px; }
.songBox                        { margin-bottom: 28px;float: none;display: inline-block;vertical-align: top; margin-right: -4px;padding-right: 60px;padding-left: 50px;    line-height: 1.3; color:#fff;}
.playlistPage .playList-Wrapper .row { max-width: 1320px; }
.playList-iframe                {position:  absolute;bottom: -10px;width: calc(100% + 40px); left:-40px;}
.playList-iframe .mixcloud-iframe{}


@media (max-width:1024px)  {
    .topImgCaption{width:70%}
}


span.small                      { font-size: 14px; display: block; }
span.NavigationDate             { font-size: 120%; display: block; }

.monthPass {position: absolute;background: #000000;width: 145px;height:  88px;bottom:  40px;right: 40px;opacity: 1;}
.monthPass.monthPass.prev {right: auto;left: 40px;}
.monthPass.hvr-sweep-to-right{font-size:120%; text-transform:uppercase;}
span.hvr-sweep-to-right-content {padding: 25px 0px 25px 20px;position: absolute;right: 0;bottom: 0;line-height: 1;width: 100%;z-index: 1;opacity: 0;-webkit-transform: translate(-30%, 0);transform: translate(-30%, 0);-webkit-transition: all 0.6s;-moz-transition: all 0.6s;-o-transition: all 0.6s;transition: all 0.6s;transition-delay: 0s;pointer-events: none;}
.monthPass:hover span.hvr-sweep-to-right-content {opacity:  1;-webkit-transform: translate(0%, 0);transform: translate(0%, 0);}
.navigation button {padding: 25px 0px 25px 20px;position: absolute;right: 0;bottom: 0;text-transform: uppercase;line-height: 1;text-align: left;width: 100%;z-index: 1;}
.navigation button.prevLink {text-align: right;    padding: 25px 20px 25px 0px;}
.prev span.hvr-sweep-to-right-content {text-align: right;    padding: 25px 20px 25px 0px;}
.navigation a{ text-align: left; background: #000000; display: inline-block; padding:25px 30px; color: inherit;position: absolute; right: 40px;bottom: 40px;min-width: 145px; text-align: center; text-transform: uppercase;transition:all 250ms ease-in-out;-webkit-transition:all 250ms ease-in-out; line-height: 1;text-align: left; }
.navigation a.prevLink          { right:auto;left:40px;text-align:right; }
.navigation a:hover, .navigation a:focus           { text-decoration:none; }
.hvr-sweep-to-left:before  { background: #f15a55;    -webkit-transition: all 500ms cubic-bezier(0.77, 0, 0.175, 1);transition: all 500ms cubic-bezier(0.77, 0, 0.175, 1); }

.pinkLayer {position: fixed;top: 0;left: 0;right: -200%;bottom: 0;background-color: #F15A55;z-index: 1;pointer-events:none;width:0;}

@media(max-width:1200px) {
   .allMixtapes    { bottom:40px; }
   .mixTapeBoxes.row { max-width: 95%; }
    .Title.row { max-width: 100%; }
    .allMixtapesContainer h2 { font-size: 300%; }
}

@media(max-width:1024px){
    .allMixtapesContainer .closePage {right:0;}
}
@media(max-width:991px) {
    .navigation a.prevLink      { left: 0px; }
    .navigation a               { bottom: 20px; }
    .navigation a.nextLink      { right: 0px; }
    .playlistPage .playList-Wrapper { padding-top:50px; padding-bottom:50px; }
    .mixTapeBoxes.row   { height:65vh; }
    .allMixtapesContainer   { background-position:70%;}
    .allMixtapes {left: 7%;transform: none;bottom:40px;}
    .allMixtapesContainer .closePage {}
    .allMixtapesContainer .playList-title{padding-left: 33px;font-size: 350%;padding-right:0px;}
}
@media(max-width:767px){
    .allMixtapes    { bottom:80px; }
    
    .hvr-sweep-to-right > button{font-size:80%;padding: 0px 0px 8px 26px;}
    .allMixtapes.hvr-sweep-to-right > button{padding: 0px 10px 8px 10px; }
    .allMixtapes.hvr-sweep-to-right.hvr-sweep-to-right:after{display:none}
    span.hvr-sweep-to-right-content{padding: 15px 0px 15px 40px;}
    .allMixtapes.bottomList {margin: 0 auto;left: 50%;transform: translateX(-50%);-webkit-transform: translateX(-50%);    bottom: 90px;}
    .allMixtapes.bottomList > button{padding: 15px 32px;}
    .main-wrapper .allMixtapes.hvr-sweep-to-right > button {padding: 15px 32px;}
    .navigation button.prevLink{padding: 0px 26px 8px 0px;}
    .prev span.hvr-sweep-to-right-content{padding: 15px 40px 15px 0px;}
    .topImgCaption              { width: 100%; }
    #headline h1                { font-size:250%;    margin-right: -20px;padding: 0 5px;}
    .playIcon svg#playIcon, .playIcon svg#pauseIcon {width: 73px;}
    #headline                                       { margin-bottom: 20px; }
    span.NavigationDate         { font-size: 110%; }
    span.small                  { font-size: 13px; margin-bottom: 4px; }
    .navigation a               { min-width: 0;padding: 20px 25px; }
    .playlistPage .playList-Wrapper { padding-top: 35px; padding-bottom: 0px; }
    .footerInternal p               { font-size: inherit; }
    .footerInternal { margin-bottom: 50px; font-size: 80%; margin-top:60px}
    .allMixtapesContainer h2 { font-size: 200%; }
    .allMixtapesContainer   {}
    .mixTapeBoxWrapper svg  { width: 35px;height: 35px; position: absolute; bottom: 5px; right: 5px; }
    .allMixtapesContainer .playList-title{font-size: 10vw;margin-bottom: 20px;margin-top: 30px;}
    .middlecontent .playList-title .word {margin-right: 4vw;white-space: nowrap;}
    .middlecontent #closeIcon {width: 6vw;}
    .allMixtapesContainer .closePage {top: 2px;z-index: 0;}

}


/*****HOMEPAGE***/

#PageBreadCrumps    {display:none;}



.main-wrapper {width: 100%;height:  100vh;float: left;overflow:hidden; position:absolute;}
.left-wrapper,
.right-wrapper {overflow:hidden;top:0;width: 50%;position: absolute;height: 100%;}
.right-wrapper{right:0;}
.left-wrapper{left:5%;width:40%;}

#right-wrapper-color {height: 0%;bottom: 0%;right: 0;}
#left-wrapper-color {height: 0%;top: 0%;left: 0;}

#right-wrapper-color,
#left-wrapper-color{width: 50%;position: absolute;z-index: 9;transition: all 0ms ease-in;-webkit-transition: all 0ms ease-in;background: #f15a55;}
.NoHomePage #right-wrapper-color, .NoHomePage #left-wrapper-color {opacity:  0;}


.center-wrapper {position:  absolute;width: 150px;top: 50%;left: 50%;transform: translate(-50%, -50%);z-index: 8;}
.NoHomePage .center-wrapper {display:none;}

/*.movement .center-wrapper .monthBox {pointer-events:  none;}*/
.center-wrapper .monthBox{width: 100%;height:  88px;text-align:  center;padding: 25px 0;font-size: 120%;font-family: 'CeraGRMedium-Richkid';text-transform:  uppercase;float: left;color: #8c8c8c;cursor: pointer;transition: all 1000ms ease-in;-webkit-transition: all 1000ms ease-in;position:  relative;}
.center-wrapper .monthBox .monthBG{position:  absolute;    background-color: rgb(71,71,71);height:  100%;width: 6px;top: 0;left: 50%;transform:  translateX(-50%);z-index: -1;opacity:1;}
.center-wrapper .monthBox .monthMask {position: absolute;background: #474747;height: 100%;width: 6px;top: 0;z-index: 1;opacity: 0;left: 50%;}
.center-wrapper .monthBox .equalizer {position:  absolute;width: 13px;height:  100%;top: 25px;opacity: 0;z-index:3;transition: all 150ms ease-out;-webkit-transition: all 150ms ease-out;transform: translateX(0px);}
.center-wrapper .monthBox.active .equalizer{transform: translateX(36px);transition: all 400ms ease-out;-webkit-transition: all 400ms ease-out;}

.equalizer {}
.center-wrapper .monthBox.playing .equalizer{opacity:  1;animation-delay: 2s;}
.center-wrapper .monthBox .equalizer svg{fill:#8c8c8c;}
.center-wrapper .monthBox.active .equalizer svg{fill:#fff;}
.center-wrapper .monthBox.active{color: #fff;width: 100%;text-align:  center;}
.center-wrapper .monthBox span{position:  absolute;width: 50%;left: 0;}
.center-wrapper .monthBox.active span{}

.right-wrapper .playList-details,
.left-wrapper .playList-Wrapper{width: 100%;height: 100%;position:  absolute;opacity:0; z-index:0;background-size:cover;}


.right-wrapper .playList-icons > a {width: 103px;display:block;   margin-top: 30px;position:relative;}


.right-wrapper .playList-icons > a.pause {margin-top: -112px;opacity:0;pointer-events:none;}
.right-wrapper .playList-details .playList-info {position:  absolute;top: 50%;transform: translateY(-50%);left: 21%;width: 79%;max-height: 0;overflow:  hidden;}
.right-wrapper .playList-details.active .playList-info{max-height:  800px;transition: all 500ms ease-out;-webkit-transition: all 500ms ease-out;transition-delay: 800ms;}
.right-wrapper .playList-title {font-size: 500%;font-family: 'CeraGRBlack-Richkid';line-height: 1;    -webkit-transform-style: preserve-3d;transform-style: preserve-3d;-webkit-perspective: 1000px;perspective: 1000px;}
 .playList-title span span {opacity: 0;-webkit-transform: translateZ(-1em) rotateX(90deg);transform: translateZ(-1em) rotateX(90deg);-webkit-transform-origin: top center;-ms-transform-origin: top center;transform-origin: top center;-webkit-transition: all 1s cubic-bezier(0.19, 1, 0.22, 1);transition: all 1s cubic-bezier(0.19, 1, 0.22, 1);display: inline-block;}
 .playList-title span span.showItem{opacity: 1;-webkit-transform: translateZ(0) rotateX(0);transform: translateZ(0) rotateX(0);-webkit-transition-delay: 0.525s;transition-delay: 0.525s;}
.right-wrapper .playList-title span.word {display: inline-block;margin-right: 50px;}
.right-wrapper .playList-date {font-size: 170%;font-family: 'CeraGRMedium-Richkid';text-transform:capitalize;}

.left-wrapper .playList-Wrapper {top:-5vh;}
.left-wrapper .playList-Wrapper .topGradient {position:  absolute;top: 24%;height: 50px;width: 100%;background: linear-gradient(to top, rgba(22,22,22,0), rgba(22,22,22,1));z-index:  1;opacity:0;pointer-events:none;}
.left-wrapper .playList-Wrapper:after {content: "";position:  absolute;bottom: 24%;height: 50px;width: 100%;background: linear-gradient(to bottom, rgba(22,22,22,0), rgba(22,22,22,1));z-index:  1;}
.left-wrapper .SongTime{max-width: 60px;}
.left-wrapper .SongName {font-family: 'SimplerBold';}
.left-wrapper .SongArtist {font-size: 95%;line-height: 1;padding-bottom: 18px;}
.left-wrapper .playList-Wrapper-inner::-webkit-scrollbar-track {background: transparent;}
.left-wrapper .playList-Wrapper-inner::-webkit-scrollbar-track:hover {background: transparent;}
.left-wrapper .playList-Wrapper-inner::-webkit-scrollbar-track:active {background: transparent;}
.left-wrapper .playList-Wrapper-inner::-webkit-scrollbar-thumb{background:transparent;}
.left-wrapper .playList-Wrapper .playList-Wrapper-inner {position:  absolute;top: 50%;transform: translateY(-50%);height: 50%;overflow: scroll;width: 100%;max-height: 0;overflow-x:hidden}
.left-wrapper .playList-Wrapper.active .playList-Wrapper-inner{max-height: 50%;}
.left-wrapper .playList-list {position:  absolute;width:100%;}
.left-wrapper .playList-list a{color:inherit;}

@media(max-width:1360px){
    .right-wrapper .playList-title {font-size: 380%;}
}

@media(min-width:992px){
    .left-wrapper .playList-list {width:70%;}
    .left-wrapper .openPlayList{display:none !important;}
}
@media(max-width: 991px){
    #right-wrapper-color {width: 86%;}
    #left-wrapper-color {width: 14%;}
    
    .right-wrapper {width: 86%;}
    .right-wrapper .playList-title{font-size:450%;}
    .right-wrapper .playList-title span.word{margin-right:30px;}
    .left-wrapper {width: 100%;overflow:  visible;transition: all 200ms ease-out;-webkit-transition: all 200ms ease-out;z-index:9;left: -96vw;right: 100vw;}
    .allMixtapesActive .left-wrapper { right: -24vw; }
    .center-wrapper {left: 4%;margin-left: 0;transform: translateY(-50%);}
    .playlistOpen .center-wrapper { pointer-events: none;}
    .left-wrapper .playList-Wrapper:before,
    .left-wrapper .playList-Wrapper:after{display:none}
     .movement .left-wrapper .openPlayList {opacity:0;transition: all 200ms ease-out;-webkit-transition: all 200ms ease-out;}
    .left-wrapper .openPlayList {position:  absolute;top: 10%;color: #fff;background: #161616;font-size:  130%;line-height: 1.26;padding: 0;width: 14vw;height: 90px;opacity:1;transition: all 200ms ease-out;-webkit-transition: all 200ms ease-out;right: -14vw;display:block;}
    .left-wrapper .openPlayList .openList{opacity:1}
    .left-wrapper .openPlayList .closeList{opacity:0;text-align:  center;}
    .left-wrapper .playList-Wrapper-inner {transition: all 200ms ease-out;-webkit-transition: all 200ms ease-out;height: 80vh;background: #161616;}
    .left-wrapper .openPlayList div {position:  absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 85%;}
    .left-wrapper .openPlayList div .arrow{position:absolute;-webkit-animation:linear infinite alternate;-webkit-animation-name: left-right;-webkit-animation-duration: 1.2s;top: 50%;transform: translateY(-50%);font-size: 130%;}
    .left-wrapper .playList-list {height: 90%;top: 5%;width: 80%;left: 25%;overflow-y:  scroll;opacity: 1;}
    .left-wrapper .playList-list > .row{padding-bottom: 10px;}
    .left-wrapper .playList-list::-webkit-scrollbar-track {background: transparent;}
    .left-wrapper .playList-list::-webkit-scrollbar-track:hover {background: transparent;}
    .left-wrapper .playList-list::-webkit-scrollbar-track:active {background: transparent;}
    .left-wrapper .playList-list::-webkit-scrollbar-thumb{background:transparent;}
    .left-wrapper .SongCredit {padding-left: 40px;}   
    .main-wrapper .main-wrapperBG {position:  absolute;width: 100%;height:  100%;content:  "";background: rgba(0, 0, 0, 0.5);opacity:0;pointer-events:none;transition: all 200ms ease-out;-webkit-transition: all 200ms ease-out;z-index:1;    transition-delay: 350ms;top:0px;} 
    .main-wrapper.playlistOpen .main-wrapperBG {transition: all 200ms ease-out;-webkit-transition: all 200ms ease-out;opacity: 1;    transition-delay: 130ms;}
}

@media(max-width: 991px) and (min-width:768px) {
    .left-wrapper .playList-Wrapper.active .playList-Wrapper-inner {max-height: 70%;height:80%;position: relative;}
    .left-wrapper .openPlayList{top:15%}
    .main-wrapper.playlistOpen .left-wrapper .openPlayList{width: 10vw;right: -9vw;}
}

@media(max-width:767px){
    #right-wrapper-color {width: 80%;}
    #left-wrapper-color {width: 20%;}
    .right-wrapper {width: 80%;}
    .right-wrapper .playList-title {font-size: 165%;}
    .right-wrapper .playList-title span.word {margin-right:5%;}
    .right-wrapper .playList-info {width: 90%;left: 10%;}
    .right-wrapper .playList-date {font-size: 110%;}
    .right-wrapper .playList-icons > a {width: 70px;margin-top: 0px;}
    .right-wrapper .playList-icons {margin-top: 20px;}
    
    .center-wrapper {width: 28%;left: 6%;}
    .center-wrapper .monthBox {padding: 4vw 0;height: 15vw;font-size: 90%;text-align:  left;}
    .left-wrapper {}
    .allMixtapesActive .left-wrapper { left: -96vw; }
    .left-wrapper .openPlayList div {width: 50%;font-size: 70%;}
    .left-wrapper .openPlayList {margin-top: 120px;top: 0;width: 25vw;right: -24vw;height: 60px;}
    .left-wrapper .playList-Wrapper-inner{margin-top: 90px;top: 0;transform:  translateY(0);}
    .left-wrapper .SongCredit, .left-wrapper .SongTime {font-size: 80%;}
    .left-wrapper .playList-list{width:90%;left: 22%;}
    .left-wrapper .playList-Wrapper .playList-Wrapper-inner {top: 0%;transform: none;}
    .right-wrapper .playList-icons > a.pause{margin-top:-78px}
    .left-wrapper .SongArtist {margin-bottom:8px;padding-bottom:0px;}
    .center-wrapper .monthBox .equalizer{top: 27%;left: -6%;width: 8%;}
    .center-wrapper .monthBox span{padding-left: 5%;}
    .center-wrapper .monthBox.active span{padding-left:0px}
    .center-wrapper .monthBox.active .equalizer{transform: translateX(350%);}
    .left-wrapper .SongCredit { padding-left: 15px; } 
}


.circleSVG {position:  absolute;width: 100%;height:  100%;top: 0;}
.progress {transform: rotate(-90deg);margin:  0;padding:  0;border: none;box-shadow:  none;background:  transparent;border-radius: 0;width: 100%;height:  auto;}
#pauseIcon {fill: #fff;}
.progress__value {stroke-dasharray: 339.292;stroke-dashoffset: 339.292;    transition: all 200ms ease-out;-webkit-transition: all 200ms ease-out;}
.playIconSVGTriangle{fill:#FFFFFF;}
.playIconSVGCircle{fill:#FFFFFF;}

#PageView{position:absolute; top:0;width:100%;}
#PageView.playListOn {max-height: 100vh;overflow: hidden;}
#PageView .playIcon a.play  {position: relative;width: 103px;display: block;margin: 0px auto;}
#PageView .playIcon a.pause { position: relative; width: 103px;margin: 0px auto;}
#PageView .playList-iframe  { width: 50vw;z-index: 1;bottom: auto;left: 25vw; top:85vh}
#PageView .topImgSrcMobile  {display:none}
#PageView .playIcon {height: 112px;}


@media only screen and (max-device-width: 1400px) and (min-device-width: 1025px) and (orientation: landscape) {
    #PageView .playList-iframe  {top: 61.5vh;} 
}

@media  (max-width:1024px) and (min-width:992px){
    #PageView .playList-iframe  {top: 59.5vh;}
    
}
@media  (max-width:1024px) and (min-width:992px) and (orientation:portrait){
    #PageView .playList-iframe {top: 93.5vh;width: 100%;left: 0;}
    #PageView .topImgSrcMobile  {display:block}
    #PageView .topImgSrc         {display:none;}
}

@media(max-width:991px){
    #PageView .topImgSrcMobile  {display:block}
    #PageView .topImgSrc         {display:none;}
    #PageView  .topImg             { position: relative; height:calc(100vh - 100px);    padding-bottom: 60px;overflow:hidden;}
    .monthPass{bottom:130px;}
    #PageView .playList-iframe{width:100%; left:0;     top: calc(100vh - 160px);}
    .topImg img { height:auto;}
}

@media(max-width:767px){
    #PageView  .topImg             { height:calc(100vh - 68px);   }
    #PageView .playList-iframe{ top: calc(100vh - 128px);}
    .monthPass{bottom:auto;top: calc(100vh - 168px);width: 55px;}
    .monthPass.monthPass{right:0;height: 40px;}
    .monthPass.monthPass.prev{right:auto; left:0;}
    #PageView .playIcon a.play,
    #PageView .playIcon a.pause,
    #PageView .playIcon svg.playIcon, #PageView .playIcon svg.pauseIcon,
    .playIcon svg#playIcon, .playIcon svg#pauseIcon{width: 80px;}

    .hvr-sweep-to-right.monthPass:hover:before{display:none;}
    .monthPass button {opacity: 1 !important;}
}




body.allMixtapesActive {/*background-image: url(../../../000Frames/site/images/mixTapesBG.jpg);*/background-attachment: fixed;    overflow-x: hidden;}
.NoHomePage .main-wrapper {height:  auto !important;overflow:  hidden;}
.NoHomePage .mixTapeBoxes.row {height: auto;top: 25vh;position:  relative;padding-bottom: 25vh;overflow: auto;}
.allMixtapesActive .allMixtapesContainer.active {max-height: none !important;position: relative;background-attachment: fixed;background-size:cover;}
.NoHomePage .left-wrapper { display: none; }


#barba-wrapper.playlistPage .barba-container{opacity:0}

@media(max-width:991px){
    .NoHomePage .mixTapeBoxes.row {height: auto;top: 15vh;    padding-bottom: 15vh;}
}

@media(max-width:767px){
    
    .allMixtapes.hvr-sweep-to-right:before {opacity:  0;}
    .allMixtapes.hvr-sweep-to-right:hover > button {opacity:  1;}
}


.footerLogos {position:  absolute;width: 50%;bottom: 10px;z-index: 1;left: 20px;opacity:0;}
.footerLogos a{display:  inline-block;margin-right: 20px;position:  relative;}
.footerLogos a.mixCloudLogo{bottom: 10px;}
.footerLogos img{max-width:104px;width: 100%;}

@media(max-width:991px){
    .footerLogos {right: 20px;left: auto;direction: rtl;width: 100%;}
}
@media(max-width:767px){
    .footerLogos{width: 80%;right: 0;padding:  0 15px;bottom: 70px;}
    .footerLogos a{margin-right:  0;margin-left: 10px;display:  block;}
    .footerLogos img {max-width: 84px;}
}




.left-wrapper .playList-Wrapper .playList-Wrapper-inner {
  -ms-overflow-style: none;
}    
@media(max-width:991px){
    h2{margin:0px;}
    body {width: 100%;height: 100%;}
    .slideout-menu {position: fixed;width: 256px;min-height: 100vh;overflow-y: scroll;-webkit-overflow-scrolling: touch;z-index: 0;display: none;}
    .slideout-menu-left {}
    .slideout-menu-right {right: 0;}
    .slideout-open .slideout-panel {position: relative;will-change: transform; /* A background-color is required */margin:  0px;padding:  0;display:  inline-block;overflow: visible;z-index: 11;left: -103vw;}
    
    .slideout-open, .slideout-open body {overflow: hidden;}
    .slideout-open .slideout-menu {display: block;display: none;}
    .playList-Wrapper-inner {width: calc(100vw - 70px);position:  relative;}
    .playList-Wrapper-inner {transition: all 200ms ease-out;-webkit-transition: all 200ms ease-out;height: 80vh;background: #161616;}
    .playList-list {height: 90%;top: 5%;width: 80%;left:  10%;overflow-y:  scroll;opacity: 0;}
    .playList-list > .row{padding-bottom: 10px;}
    .playList-list::-webkit-scrollbar-track {background: transparent;}
    .playList-list::-webkit-scrollbar-track:hover {background: transparent;}
    .playList-list::-webkit-scrollbar-track:active {background: transparent;}
    .playList-list::-webkit-scrollbar-thumb{background:transparent;}
    .SongCredit {padding-left: 40px;}   

}

@-webkit-keyframes left-right {
    0% { right: -5%;}
    50%{ right : 5%;}
    100%{ right: -5%;}
}